<template>
	<view class="page">
		<!-- <image class="top-img" src="../../static/page/top-img.png"></image> -->
		<view class="title">
			<view>您好，欢迎登录！</view>
			<!-- <view>江西科技职业学院人事管理系统</view> -->
		</view>
		<view class="input-item">
			<view class="input-tit">账号</view>
			<u--input placeholder="请输入你的账号" v-model="username" border="bottom" clearable></u--input>
		</view>
		<view class="input-item">
			<view class="input-tit">密码</view>
			<u--input placeholder="请输入您的密码" type="password" v-model="password" border="bottom" clearable></u--input>
		</view>
		<view class="input-item">
			<view class="input-tit">验证码</view>
			<view class="flex align between">
				<u--input placeholder="请输入验证码" v-model="captcha_code" border="bottom" clearable></u--input>
				<image @click="getCaptcha" :src="codeImg" style="width: 260rpx;height: 80rpx;"></image>
			</view>
		</view>
		<view class="btn" @click="toLogin">登录</view>
		<!-- <view class="btn2" @click="wxLogin">游客登录</view> -->
	<!-- 	<view class="tips">没有账号？<text @click="toUrl">立即注册</text></view>
		<u-divider text="第三方账号登录"></u-divider>
		
		<image src="../../static/wechart.png" class="wechart"></image>
		<u-overlay :show="show">
			<view class="warp">
				<u-loading-icon color="#fff" textColor="#fff" text="登录中" textSize="18"></u-loading-icon>
			</view>
		</u-overlay> -->

	</view>
</template>

<script>
	import {
		AesEncode
	} from '@/until/until.js'
	import {
		adminLogin,
		commonCaptcha,
		wechatConfig,
		wechatLogin,
		wxappLogin
	} from '@/api/apiData.js';
	export default {
		data() {
			return {
				value: '',
				// 状态栏高度
				statusBarHeight: 0,
				captcha_code: '',
				username: '',
				password: '',
				codeImg: '',
				captcha_id: '',
				config: '',
				show: false,
				obj: {}
			}
		},
		created() {
			//获取手机状态栏高度
			this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight'];
		},
		onLoad() {
			this.getCaptcha()
			// this.getConfig()
			const type = uni.getSystemInfoSync().uniPlatform
			if (type == 'mp-weixin') {
				console.log('在小程序内');
			} else {
				this.checkWeChatCode()
			}
			// this.isWeixin = this.isWechat()
			// if (this.isWeixin) {
			// 	this.checkWeChatCode() //通过微信官方接口获取code之后，会重新刷新设置的回调地址【redirect_uri】
			// }
		},
		methods: {
			async getConfig() {
				const result = await wechatConfig()
				this.config = result.data
			},
			toBack() {
				uni.navigateBack()
			},
			toUrl() {
				uni.navigateTo({
					url: "/pages/register/register"
				})
			},
			async getCaptcha() {
				const result = await commonCaptcha()
				this.codeImg = result.data.content
				this.captcha_id = result.data.uniqid
			},
			async toLogin() {
				if (this.username == '') {
					uni.showToast({
						title: '请输入账号',
						icon: 'error'
					});
					return false
				}
				if (this.password == '') {
					uni.showToast({
						title: '请输入密码',
						icon: 'error'
					});
					return false
				}
				if (this.captcha_code == '') {
					uni.showToast({
						title: '请输入验证码',
						icon: 'error'
					});
					return false
				}
				console.log(this.captcha_code)
				let obj = {
					username: this.username,
					password: AesEncode(this.password),
					captcha_id: this.captcha_id,
					captcha_code: AesEncode(this.captcha_code),
				}
				const result = await adminLogin(obj)
				if (result.code == 1) {
					uni.showToast({
						title: result.msg,
						icon: 'success',
						mask: true
					});
					uni.setStorageSync('tokenM', result.data.token);
					setTimeout(() => {
						uni.navigateTo({
							url: '/pages/manage/manage'
						})
					}, 1000);
				} else {
					uni.showToast({
						title: result.msg,
						icon: 'error'
					});
					setTimeout(() => {
						this.getCaptcha()
					},1000)
				}
			},
			async wxAppLogin() {
				let obj = this.obj
				const result = await wxappLogin(obj)
				if (result.code == 1) {
					uni.showToast({
						title: result.msg,
						icon: 'success',
						mask: true
					});
					uni.setStorageSync('token', result.data.token);
					uni.setStorageSync('type', 2);
					setTimeout(() => {
						uni.reLaunch({
							url: '/pages/index/index'
						})
						// uni.navigateBack({
						// 	delta: 1,
						// 	fail(error) {
						// 		uni.reLaunch({
						// 			url: '/pages/index/index'
						// 		})
						// 	}
						// })
					}, 1000);
				} else {
					uni.showToast({
						title: result.msg,
						icon: 'error'
					});
				}
			},
			// 微信登陆
			wxLogin() {
				let that = this
				const type = uni.getSystemInfoSync().uniPlatform
				if (type == 'mp-weixin') {
					console.log('在小程序内');
					uni.getUserInfo({
						desc: '登录的数据',
						success(ures) {
							console.log(ures, '返回的用户信息');
							uni.login({
								provider: 'wechat',
								success: function(res) {
									console.log('微信登录成功', res)
									let obj = {
										code: res.code,
										encryptedData: ures.encryptedData,
										iv: ures.iv
									}
									that.obj = obj
									that.wxAppLogin()
								},
								fail: function(err) {
									console.log('微信登录失败', err)
								}
							})
						}
					})
				} else {
					console.log('不在小程序内');
					let local = encodeURIComponent(window.location.href); //获取当前页面地址作为回调地址
					let appid = this.config.appId
					//通过微信官方接口获取code之后，会重新刷新设置的回调地址【redirect_uri】
					let href = "https://ncymkj.doudou00.com/get-weixin-code.html?appid=" + appid +
						"&response_type=code&scope=snsapi_userinfo&state=123456&redirect_uri=" + local + "#wechat_redirect"
					console.log(href)
					window.location.href = href
				}
				console.log(type) // app
				// var wx = require('weixin-js-sdk');
				// // 判断是否在微信浏览器内
				// if (ua.match(/MicroMessenger/i) == "micromessenger") {
				// 	wx.miniProgram.getEnv((res) => {
				// 		if (res.miniprogram) {
				// 			console.log('在小程序内');
				// 		} else {
				// 			let local = encodeURIComponent(window.location.href); //获取当前页面地址作为回调地址
				// 			let appid = this.config.appId
				// 			//通过微信官方接口获取code之后，会重新刷新设置的回调地址【redirect_uri】
				// 			let href = "https://ncymkj.doudou00.com/get-weixin-code.html?appid=" + appid +
				// 				"&response_type=code&state=123456&redirect_uri=" + local + "#wechat_redirect"
				// 			console.log(href)
				// 			window.location.href = href
				// 		}
				// 	})
				// } else {
				// 	console.log('不在微信浏览器内');
				// }


			},
			//检查浏览器地址栏中微信接口返回的code
			checkWeChatCode() {
				let code = this.getUrlCode('code')
				if (code) {
					// uni.showToast({
					// 	title: `微信code=${code}`
					// })
					this.getOpenidAndUserinfo(code)
				}
			},
			//方法：用来判断是否是微信内置的浏览器
			isWechat() {
				return String(navigator.userAgent.toLowerCase().match(/MicroMessenger/i)) === "micromessenger";
			},
			getUrlCode(name) {
				return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) ||
				[, ''
				])[1].replace(/\+/g, '%20')) || null
			},
			async getOpenidAndUserinfo(code) {
				this.show = true
				const result = await wechatLogin({
					code: code
				})
				if (result.code == 1) {
					console.log(666)
					uni.setStorageSync('token', result.data.token);
					uni.setStorageSync('type', 2);
					uni.reLaunch({
						url: '/pages/index/index'
					})
					this.show = false
				} else {
					this.show = false
					// uni.showToast({
					// 	title: result.msg,
					// 	icon: 'error'
					// });
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.warp {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
	}

	.navBarBox {
		.navBar {
			padding: 3rpx 50rpx;
			padding-bottom: 8rpx;
			display: flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;
			position: relative;

		}

		.icons {
			position: absolute;
			left: 0;
		}
	}

	.top-img {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: -1;
	}

	.page {
		padding: 20rpx;
		color: $uni-text-color;

		.title {
			margin: 30rpx 20rpx;

			view:nth-child(1) {
				font-size: 46rpx;
			}

			view:nth-child(2) {
				font-size: 32rpx;
				margin-top: 20rpx;
				margin-bottom: 80rpx;
			}
		}

		.input-item {
			padding: 0 16rpx;
			margin-top: 72rpx;
			font-size: 32rpx;

			.input-tit {
				font-size: 40rpx;
			}
		}

		.btn {
			background: #5690FB;
			color: white;
			font-size: 40rpx;
			text-align: center;
			line-height: 96rpx;
			border-radius: 5rpx;
			margin: 70rpx 20rpx 50rpx;
		}

		.btn2 {
			background: linear-gradient(to right, #eb7344, #de9400);
			color: white;
			font-size: 40rpx;
			text-align: center;
			line-height: 96rpx;
			border-radius: 50rpx;
			margin: 0rpx 20rpx 50rpx;
		}

		.tips {
			font-size: 28rpx;
			color: #C0C4CC;
			text-align: center;
			margin-bottom: 80rpx;

			text {
				color: #017DF9;
			}
		}

		.wechart {
			width: 88rpx;
			height: 88rpx;
			display: block;
			margin: 50rpx auto;
		}
	}
</style>